<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery select下拉框美化插件</title>

<link rel="stylesheet" type="text/css" href="css/jquery.selectlist.css">
 
</head>

<body>
 
<div style="width:620px;margin:40px auto 0 auto;">
	<select id="edu" name="edu">
		<option value="0">初中</option>
		<option value="1">高中</option>
		<option value="2">中技</option>
		<option value="3">中专</option>
		<option value="4">大专</option>
		<option value="5">本科</option>
		<option value="6">硕士</option>
		<option value="7">博士</option>
		<option value="8">博士后</option>
		<option value="9">教授</option>
	</select>
	<select id="salary" name="salary">
		<option value="0">面议</option>
		<option value="1">1000以下</option>
		<option value="2">1000-2000</option>
		<option value="3">2000-3000</option>
		<option value="4">3000-5000</option>
		<option value="5">5000-6000</option>
		<option value="6">6000-8000</option>
		<option value="7">8000-10000</option>
		<option value="8">10000-20000</option>
		<option value="9">20000以上</option>
	</select>
</div>

<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/jquery.selectlist.js"></script>
<script type="text/javascript">
$(function(){
	$('select').selectlist({
		zIndex: 10,
		width: 300,
		height: 40,
		
	});		
});
</script>

</body>
</html>
